<template>
  <div>
    <Topnav titleTxt="我的关注"></Topnav>
    <!-- 这里是关注的内容 -->
    <AttenBar :attendata="attenData" @SendId="CancelAtten"></AttenBar>
  </div>
</template>
<script>
// 引入顶部导航组件
import Topnav from "@/components/TopNav.vue";
//引入关注条形组件
import AttenBar from "@/components/AttentionBar.vue";
export default {
  // 这里是注册组件
  components: {
    Topnav,
    AttenBar
  },
  data() {
    return {
      attenData: []
    };
  },
  mounted() {
    this.GetAttenData();
  },
  methods: {
    CancelAtten(user_id) {
      console.log(user_id);
      this.$axios({
        url: "/user_unfollow/" + user_id,
        method: "GET"
      }).then(res => {
        console.log(res);
        //调用获取数据的函数
        this.GetAttenData();
      });
    },
    // 封装获取数据的函数
    GetAttenData() {
      this.$axios({
        url: "/user_follows",
        method: "GET"
      }).then(res => {
        console.log(res);
        if (res.status === 200) {
          // console.log("这里是修改页面");
          const { data } = res.data;
          console.log("这里是我的关注页", data);
          this.attenData = data;
        }
      });
    }
  }
};
</script>
